/* Scope every selector to the host. This artwork does not change site branding. */
.compasity-object{position:relative;isolation:isolate;width:100%;height:100%;min-height:340px;overflow:hidden;background:#000}
.compasity-object__fallback,.compasity-object__canvas{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.compasity-object__canvas{opacity:0;transition:opacity 1.2s ease}
.compasity-object[data-state=ready] .compasity-object__canvas{opacity:1}
.compasity-object__overhead{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:2;pointer-events:none;mix-blend-mode:screen;clip-path:inset(0 0 calc(100% - var(--compasity-light-limit,59%)) 0);-webkit-mask-image:linear-gradient(#000 var(--compasity-light-fade,46%),transparent var(--compasity-light-limit,59%));mask-image:linear-gradient(#000 var(--compasity-light-fade,46%),transparent var(--compasity-light-limit,59%))}
.compasity-object::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#000 0%,transparent 13%,transparent 89%,#000 100%),linear-gradient(0deg,#000,transparent 15%,transparent 93%,#000);z-index:1}
@media(prefers-reduced-motion:reduce){.compasity-object__canvas{transition:none}}
@media(max-width:700px){.compasity-object{min-height:280px}}
