.media-carousel{--carousel-nav-inset: var(--space-2);--carousel-nav-size: 2rem;position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0}.media-carousel:focus-visible{outline:2px solid var(--color-brand-400);outline-offset:2px;border-radius:var(--radius-md)}.media-carousel__frame{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0;overflow:hidden}.media-carousel__media,.media-carousel .protected-image{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}.media-carousel__nav{position:absolute;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:var(--carousel-nav-size);height:var(--carousel-nav-size);padding:0;color:var(--text-primary);background:#0000008c;border:1px solid rgba(255,255,255,.14);border-radius:var(--radius-full);cursor:pointer;opacity:0;transition:opacity var(--duration-fast) var(--ease-out),background var(--duration-fast) var(--ease-out);z-index:2}.media-carousel__nav--prev{left:var(--carousel-nav-inset)}.media-carousel__nav--next{right:var(--carousel-nav-inset)}.media-carousel:hover .media-carousel__nav,.media-carousel:focus-within .media-carousel__nav{opacity:1}.media-carousel__nav:hover{background:#000000bf}.media-carousel__nav:focus-visible{opacity:1;outline:2px solid var(--color-brand-400);outline-offset:2px}.media-carousel__nav svg{width:calc(var(--carousel-nav-size) * .5);height:calc(var(--carousel-nav-size) * .5)}@media(hover:none){.media-carousel__nav{opacity:1}}.media-carousel__dots{position:absolute;bottom:var(--space-2);left:50%;transform:translate(-50%);display:flex;align-items:center;gap:5px;padding:4px 7px;background:#00000073;border-radius:var(--radius-full);z-index:2}.media-carousel__dot{width:5px;height:5px;padding:0;border:none;border-radius:50%;background:#fff6;cursor:pointer;transition:background var(--duration-fast) var(--ease-out),width var(--duration-fast) var(--ease-out)}.media-carousel__dot--active{width:14px;border-radius:var(--radius-full);background:var(--color-brand-500)}.media-carousel__dot:focus-visible{outline:2px solid var(--color-brand-400);outline-offset:2px}.media-carousel__live{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(prefers-reduced-motion:reduce){.media-carousel__nav,.media-carousel__dot{transition:none}}