/* Effects are decorative, transparent and isolated from fitment and vehicle imagery. */
.cfg-scene-stage .cfg-effects{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;contain:layout paint}
.cfg-scene-stage .cfg-scene-backdrop{position:absolute;inset:0;z-index:0;pointer-events:none;background-color:#cbd9e4;background-position:center;background-size:cover;background-repeat:no-repeat}
.cfg-scene-backdrop[data-effect='winter']{background-image:url('/assets/winter-alpine.webp')}
.cfg-scene-backdrop[data-effect='spring']{background-image:url('/assets/scenes/spring-overlook.webp')}
.cfg-scene-backdrop[data-effect='summer']{background-image:url('/assets/scenes/summer-coast.webp')}
.cfg-scene-backdrop[data-effect='autumn']{background-image:url('/assets/scenes/autumn-overlook.webp')}
.cfg-scene-backdrop[data-effect='performance']{background-image:url('/assets/scenes/performance-track.webp')}
.cfg-scene-stage .cfg-scene-backdrop[hidden],.cfg-scene-stage .cfg-effects[hidden],.cfg-effects-toggle[hidden]{display:none}
.wheel-configurator .configurator-stage-logo{z-index:3}
.cfg-effects-atmosphere,.cfg-effects-particles{position:absolute;inset:0}
.cfg-effects-ground{position:absolute;inset:76% 0 0}
.cfg-effects-particles i{position:absolute;left:var(--x);top:-20px;width:var(--size);height:var(--size);animation:cfg-snowfall var(--duration) var(--delay) linear infinite}
.cfg-effects[data-effect='winter'] .cfg-effects-atmosphere{background:linear-gradient(180deg,#a9cbe410,transparent 45%)}
.cfg-effects[data-effect='winter'] .cfg-effects-ground{background:linear-gradient(0deg,#e9f3fa30,transparent 80%)}
.cfg-effects[data-effect='winter'] .cfg-effects-particles i{top:-40px;height:100%;animation-name:cfg-crystal-fall;opacity:var(--opacity)}
.cfg-effects[data-effect='winter'] .cfg-effects-particles i::before{content:'';display:block;width:var(--size);height:var(--size);background:url('/assets/snow-crystal.svg') center/contain no-repeat;filter:drop-shadow(0 1px 1px #34537345);animation:cfg-crystal-turn calc(var(--duration) * 1.5) var(--delay) linear infinite}
.cfg-effects[data-effect='winter'] .cfg-effects-particles i:nth-child(3n)::before{background-image:url('/assets/snow-star.svg');animation-direction:reverse}
.cfg-effects[data-effect='winter'] .cfg-effects-particles i:nth-child(7n)::before{filter:blur(.5px);opacity:.6}
.cfg-effects[data-effect='autumn'] .cfg-effects-atmosphere{background:linear-gradient(120deg,#edb9581c,transparent 48%)}
.cfg-effects[data-effect='autumn'] .cfg-effects-ground{background:linear-gradient(0deg,#cd8d4229,transparent)}
.cfg-effects[data-effect='autumn'] i{background:#b66a30;clip-path:polygon(50% 0,63% 24%,82% 13%,79% 38%,100% 41%,76% 61%,87% 79%,59% 77%,50% 100%,41% 77%,13% 79%,24% 61%,0 41%,21% 38%,18% 13%,37% 24%)}
.cfg-effects[data-effect='autumn'] i:nth-child(3n){background:#d19c3e}
.cfg-effects[data-effect='autumn'] i:nth-child(4n){background:#994828}
.cfg-effects[data-effect='autumn'] .cfg-effects-particles i{top:-70px;opacity:.8;background:linear-gradient(135deg,#efb84f,#bb582c 70%);animation-name:cfg-leaf-fall}
.cfg-effects[data-effect='autumn'] .cfg-effects-particles i:nth-child(3n){background:linear-gradient(135deg,#f4ce70,#c18b2c 70%)}
.cfg-effects[data-effect='autumn'] .cfg-effects-particles i:nth-child(4n){background:linear-gradient(135deg,#da8960,#9b4329 70%)}
.cfg-effects[data-effect='autumn'] .cfg-effects-ground i{width:30px;height:25px;opacity:.8}
.cfg-effects-ground i{position:absolute;left:var(--x);top:var(--y);width:17px;height:11px;transform:rotate(var(--rotation));opacity:.7}
.cfg-effects[data-effect='spring'] .cfg-effects-atmosphere{background:radial-gradient(ellipse at 5% 100%,#a0be7026,transparent 60%)}
.cfg-effects[data-effect='spring'] .cfg-effects-ground{background:linear-gradient(0deg,#adca8529,transparent)}
.cfg-effects[data-effect='spring'] .cfg-effects-ground i{width:12px;height:6px;border-radius:0 100% 0 100%;background:#8baf61;opacity:.45}
.cfg-effects[data-effect='spring'] .cfg-effects-ground i:nth-child(3n){background:#edb9bd}
.cfg-effects[data-effect='summer'] .cfg-effects-atmosphere{background:radial-gradient(ellipse at 95% 0,#ffd88940,transparent 58%)}
.cfg-effects[data-effect='summer'] .cfg-effects-ground{background:linear-gradient(0deg,#e7bc6b21,transparent)}
.cfg-effects[data-effect='performance'] .cfg-effects-ground{inset:73% 0 0;background:repeating-linear-gradient(115deg,transparent 0 85px,#515e6710 86px 87px,transparent 88px 170px),linear-gradient(0deg,#26333e1c,transparent)}
.cfg-effects[data-effect='performance'] .cfg-effects-atmosphere{background:radial-gradient(ellipse at 0 90%,#ad122518,transparent 40%),radial-gradient(ellipse at 100% 90%,#eeb35321,transparent 45%)}
.cfg-effects[data-effect='performance'] .cfg-effects-particles{inset:78% 0 8%;transform:skewY(-3deg)}
.cfg-effects[data-effect='performance'] .cfg-effects-particles i{left:-35%;top:var(--x);width:32%;height:2px;border-radius:50%;background:linear-gradient(90deg,transparent,#b61937a6,transparent);box-shadow:0 0 7px #b6193726;animation-name:cfg-track-light}
.cfg-effects[data-effect='performance'] .cfg-effects-particles i:nth-child(2n){background:linear-gradient(90deg,transparent,#d8a346a6,transparent)}
.wheel-configurator .cfg-effects-toggle{flex-shrink:0;min-height:44px;padding:9px 13px;border:1px solid var(--cfg-line,#ddd);border-radius:6px;background:#fff;color:var(--cfg-text,#222);font:600 11px Arial,sans-serif;cursor:pointer}
.wheel-configurator .cfg-effects-toggle[aria-pressed='true']{border-color:var(--cfg-accent,#777)}
.wheel-configurator .cfg-effects-toggle:focus-visible{outline:2px solid var(--cfg-accent,#777);outline-offset:3px}
.wheel-configurator .configurator-preview-meta{flex-wrap:wrap}
.cfg-effects.is-paused *,.cfg-effects.is-paused *::before{animation-play-state:paused!important}
@keyframes cfg-snowfall{from{transform:translate3d(0,-20px,0)}to{transform:translate3d(38px,640px,0)}}
@keyframes cfg-crystal-fall{0%{transform:translate3d(0,-40px,0)}50%{transform:translate3d(calc(var(--drift) * -.3),50%,0)}100%{transform:translate3d(var(--drift),calc(100% + 80px),0)}}
@keyframes cfg-crystal-turn{from{transform:rotate(var(--rotation))}to{transform:rotate(calc(var(--rotation) + 180deg))}}
@keyframes cfg-leaf-fall{0%{transform:translate3d(-20px,-20px,0) rotate(var(--rotation));opacity:0}10%,85%{opacity:.8}100%{transform:translate3d(95px,720px,0) rotate(calc(var(--rotation) + 220deg));opacity:0}}
@keyframes cfg-track-light{0%,15%{transform:translateX(0);opacity:0}30%{opacity:.8}85%,100%{transform:translateX(440%);opacity:0}}
@media(max-width:767px){.cfg-effects-particles i:nth-child(n+17){display:none}.cfg-effects-ground i{width:12px;height:8px}.cfg-effects[data-effect='autumn'] .cfg-effects-particles i{width:calc(var(--size) * .75);height:calc(var(--size) * .75)}.cfg-effects[data-effect='autumn'] .cfg-effects-ground i{width:23px;height:19px}.wheel-configurator .cfg-effects-toggle{min-height:44px}@keyframes cfg-snowfall{from{transform:translate3d(0,-20px,0)}to{transform:translate3d(24px,420px,0)}}@keyframes cfg-leaf-fall{0%{transform:translate3d(0,-20px,0) rotate(var(--rotation));opacity:0}10%,85%{opacity:.8}100%{transform:translate3d(60px,500px,0) rotate(calc(var(--rotation) + 160deg));opacity:0}}}
@media(prefers-reduced-motion:reduce){.cfg-effects-particles{display:none}.cfg-effects *,.cfg-effects *::before{animation:none!important}}
@media(max-width:767px){.cfg-effects[data-effect='winter'] .cfg-effects-particles i:nth-child(-n+30){display:block}.cfg-scene-stage .cfg-scene-backdrop{background-position:40% center}}
