.carousel{border-radius:var(--border-radius);background:var(--color-background-secondary);width:100%;position:relative;overflow:hidden}.carousel:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.carousel-viewport{aspect-ratio:16/9;justify-content:center;align-items:center;width:100%;display:flex}.carousel-image{object-fit:contain;width:100%;height:100%;display:block}.carousel-nav{border-radius:var(--radius-full);color:#fff;cursor:pointer;width:44px;height:44px;transition:background var(--transition-base);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0000008c;border:none;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;transform:translateY(-50%)}.carousel-nav:hover{background:#000c}.carousel-nav:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.carousel-prev{left:var(--space-3)}.carousel-next{right:var(--space-3)}.carousel-counter{top:var(--space-3);right:var(--space-3);padding:2px var(--space-2);border-radius:var(--radius-full);color:#fff;font-size:var(--font-size-sm);font-variant-numeric:tabular-nums;background:#0009;position:absolute}.carousel-dots{bottom:var(--space-3);justify-content:center;gap:var(--space-2);display:flex;position:absolute;left:0;right:0}.carousel-dot{border-radius:var(--radius-full);cursor:pointer;width:9px;height:9px;transition:background var(--transition-base), transform var(--transition-base);background:#ffffff80;border:none;padding:0}.carousel-dot:hover{background:#fffc}.carousel-dot.is-active{background:#fff;transform:scale(1.25)}.carousel-dot:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}