*{box-sizing:border-box}body{background:#f5f7fa;margin:0;font-family:Arial,sans-serif}.app{text-align:center;min-height:100vh;padding:2rem}h1{margin-bottom:2rem}.carousel{touch-action:pan-y;background:#fff;border-radius:16px;width:100%;max-width:800px;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 10px 30px #0000001f}.carousel__image-container{aspect-ratio:16/9;background:#e5e7eb;width:100%}.carousel__image{object-fit:cover;width:100%;height:100%;display:block}.carousel__button{color:#fff;cursor:pointer;background:#00000073;border:none;border-radius:50%;width:48px;height:48px;font-size:1.5rem;transition:background .3s;position:absolute;top:50%;transform:translateY(-50%)}.carousel__button:hover{background:#000000a6}.carousel__button--prev{left:1rem}.carousel__button--next{right:1rem}.carousel__dots{background:#fff;justify-content:center;gap:.75rem;padding:1rem;display:flex}.carousel__dot{cursor:pointer;background:#cbd5e1;border:none;border-radius:50%;width:12px;height:12px;transition:background .3s,transform .3s}.carousel__dot.active{background:#2563eb;transform:scale(1.2)}.carousel__dot:hover{background:#94a3b8}.carousel:focus{outline-offset:4px;outline:3px solid #2563eb}.sr-only{white-space:nowrap;clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.carousel__button:focus,.carousel__dot:focus{outline-offset:2px;outline:3px solid #2563eb}